<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" type="text/css" href="/stylesheets/article_detail.css">
</head>
<body>
<!--回到顶部-->
<%include back-top.html%>
<%include nav.html%>
	<div class="htmleaf-container">
		<header class="htmleaf-header">
			<h1>作者:<%=books[0].username%><span>文章写于<%=books[0].date%></span></h1>
			<div class="htmleaf-links">
				<a class="htmleaf-icon icon-htmleaf-home-outline" href="/" title="jQuery之家" target="_self"></a>
				<a class="htmleaf-icon icon-htmleaf-arrow-forward-outline" href="/article"  target="_self"></a>
			</div>
		</header>
	</div>
	<div class="html-content">
		<%
		if(books.length==0){
		%>
		<div>对不起，没有匹配结果</div>
		<%
		}else{
		for(var i=0;i<=books.length-1;i++){
		%>
		<div class="htmleaf-content">
			<div class="articles_title">
				<h1><%=books[i].title%></h1>
			</div>
			<div class="articles_content">
				<img src="/images/<%=books[i].icon%>" style="float: left">
				<p><%=books[i].content%></p>
			</div>
		</div>

		<%
		}
		}
		%>
		<!--点赞-->
		<div class="htmleaf-content">
			<form id="like_article">
				<div display="none">
					<input id="like_text" type="text" name="like" value="1" hidden>
					<input id="like_artno" type="text" name="like_artno" value="<%=artno%>" hidden>
				</div>
				<input id="like" type="submit" class='zan' value="">&nbsp;
				<span class="zan_count">0</span>
			</form>
		</div>
        <!--评论-->
		<div class="htmleaf-conment_title">
			<h3>评论>></h3>
		</div>
		<div class="related">
			<!--</div>-->
			<div id="comment-about-article">
				<form  class="comment">
					<input type="text" name="comment" class="all" required >
					<input type="text" class="need_hidden_useretel" name="useretel" value="<%=user%>">
					<input type="text" class="need_hidden_beforeno" name="beforeno" value='0'>
					<input type="text" class="need_hidden_artno" name="artno" value='<%=artno%>'>
					<!--<br>-->
					<input type="submit" class='submit' value="评论">
				</form>
			</div>
			<!--<div class="words">-->
				<%
				if(comment.length==0){
				%>
				<div class="like"><p>对不起，没有评论结果</p></div>
				<%
				}else{
				for(var i=0;i<=comment.length-1;i++){
				%>
				<% if(comment[i].beforeno==0){ %>
				<div class="first_comment">
					<div class="comment_info">
						<img src="/images/<%=comment[i].pic%>" alt="" class="comment_user_icon">
						<%=comment[i].username%>:<%=comment[i].content%>
					</div>
					<form class="comment">
						<input type="text" name="comment" class="com_text" required>
						<input type="text" class="need_hidden_useremail" name="useremail" value="<%=user%>">
						<input type="text" class="need_hidden_beforeno" name="beforeno" value='<%=comment[i].comno%>'>
						<input type="text" class="need_hidden_artno" name="artno" value='<%=artno%>'>
						<!--<div class="comment_date">-->
							<%=comment[i].date%> &nbsp;&nbsp;
							<input type="submit" class='com reply' name="sa" value="">
						<!--</div>-->
						<!--<input type="button" class="com report" value="">-->
					</form>
				</div>

				<%
				for(var j=0;j<=comment.length-1;j++){
				%>
				<%if(comment[j].beforeno==comment[i].comno){%>
				<div class="second_comment">
					<div class="comment_info">
						<img src="/images/<%=comment[j].pic%>" alt="" class="comment_user_icon">
						<%=comment[j].username%>@<%=comment[i].username%>:<%=comment[j].content%>
					</div>
					<form class="comment">
						<input type="text" name="comment" class="com_text" required>
						<input type="text" class="need_hidden_useremail" name="useremail" value="<%=user%>">
						<input type="text" class="need_hidden_beforeno" name="beforeno" value=<%=comment[j].comno%>>
						<input type="text" class="need_hidden_artno" name="artno" value='<%=artno%>'>
						<!--<div class="comment_date">-->
							<%=comment[j].date%>&nbsp;&nbsp;
							<input type="submit" class='com reply' name="sa" value="">
						<!--</div>-->
					</form>
				</div>
				<%
				for(var k=0;k<=comment.length-1;k++){
				%>
				<%if(comment[k].beforeno==comment[j].comno){%>
				<div class="third_comment">
					<div class="comment_info">
						<img src="/images/<%=comment[k].pic%>" alt="" class="comment_user_icon">
						<%=comment[k].username%>@<%=comment[j].username%>:<%=comment[k].content%></div>
					<form  class="comment">
						<input type="text" name="comment" class="com_text" required>
						<input type="text" class="need_hidden_useremail" name="useremail" value="<%=user%>">
						<input type="text" class="need_hidden_beforeno" name="beforeno" value=<%=comment[j].comno%>>
						<input type="text" class="need_hidden_artno" name="artno" value='<%=artno%>'>
						<!--<div class="comment_date">-->
							<%=comment[k].date%>&nbsp;&nbsp;
							<input type="submit" class='com reply' name="sa" value="">
						<!--</div>-->
					</form>
				</div>

				<%
				}
				%>
				<%
				}
				%>


				<%
				}
				%>
				<%
				}
				%>
				<%
				}
				}
				%>

				<%
				}
				%>


		</div>
	</div>
<!--底部-->
<%include footer.html%>
<!--返回顶部-->
<%include back-top.html%>

<script src="/js/jquery-1.8.3.js"></script>
<script src="/js/bootstrap-3.1.1.min.js"></script>
<script>
		$(function () {
			$('.comment').submit(function () {
				$.ajax({
					type: 'post',
					url: '/article',
					data: $(this).serialize(),
					timeout: 3000,
					dataType: 'json',
					success: function (data) {
						if(data.res=='0'){
							window.location.reload();
						}
						/*$("input[type='text']").val('')*/
					},
					error: function (error) {
						alert(error.message)
					}
				});
				return false;
			});

			$('#like_article').submit(function () {
				$.ajax({
					type: 'post',
					url: '/article',
					data: $(this).serialize(),
					timeout: 3000,
					dataType: 'json',
					success: function (data) {
						if(data.likes=='1'){
//							alert("点赞成功");
							$('.zan_count').html(parseInt($('.zan_count').html())+1);
						}else if(data.likes=='10'){
							alert('已经点赞过了')
						}
					},
					error: function (error) {
						alert(error.message);
					}
				});
				return false;
			});

		});
	</script>
	<script>
		$(function() {
			$('input[class*="need_hidden_"]').css('display', 'none');
			$('input[class*="text"]').css('display', 'none');
			$('.com.reply').click(function () {
				$(this).siblings().eq(0).css('display', 'block');
			});

			$('.zan').click(function () {
				$('.zan').css('background-color', '#df992d');
			});
			$(".com.report").click(function () {
				alert('怂逼，举报有个屁用，刚他狗娘养的');
			});
		});
	</script>

</body>
</html>